@extends('simple-h5.views.layout')
@section('content')
    <link rel="stylesheet" href="/static/libs/swiper-6.8.4/swiper-bundle.min.css">
    <link rel="stylesheet" href="/themes/simple-h5/static/css/index.css">
    <script src="/static/libs/swiper-6.8.4/swiper-bundle.min.js"></script>
    <div id="b001" class="swiper-container">
        <div class="swiper-wrapper">
            @foreach ($vars['slide']['top_slide'] as $item)
                <div class="swiper-slide">
                    <div class="swiper-slide-img">
                        <img src="{{ $item->thumb }}">
                    </div>
                </div>
            @endforeach
        </div>
    </div>

    <div id="b002">
        <div class="block-header">
            <div class="block-title">{{$vars['service']['title']}}</div>
        </div>
        <div class="service-con block-con">
            @for ($i = 1; $i < 5; $i++)
                @if ($vars['service']['itemTitle'.$i])
                <div class="block-item">
                    <div class="block-item-img">
                        <img src="{{$vars['service']['itemImg'.$i]}}" />
                    </div>
                    <div class="block-item-text">
                        <a href="">
                            <div class="block-item-title">{{$vars['service']['itemTitle'.$i]}}</div>
                            <div class="block-item-desc">{{$vars['service']['itemDesc'.$i]}}</div>
                        </a>
                    </div>
                </div>
                @endif
            @endfor
        </div>
    </div>
    <div id="b003">
        <div class="block-header">
            <div class="block-title">{{$vars['case']['title']}}</div>
        </div>
        <div class="block-con">
            <div class="case-img">
                <img src="{{$vars['case']['img']}}" />
            </div>
        </div>
    </div>
    <div id="b004">
        <div class="block-header">
            <div class="block-title">{{$vars['advantage']['title']}}</div>
        </div>
        <div class="service-con block-con">
            @for ($i = 1; $i < 7; $i++)
                @if ($vars['advantage']['itemTitle'.$i])
                <div class="block-item">
                    <div class="block-item-img">
                        <img src="{{$vars['advantage']['itemImg'.$i]}}" />
                    </div>
                    <div class="block-item-text">
                        <a href="">
                            <div class="block-item-title">{{$vars['advantage']['itemTitle'.$i]}}</div>
                            <div class="block-item-desc">{{$vars['advantage']['itemDesc'.$i]}}</div>
                        </a>
                    </div>
                </div>
                @endif
            @endfor
        </div>
    </div>
    <div id="b005">
        <div class="block-header">
            <div class="block-title">{{$vars['about']['title']}}</div>
        </div>
        <div class="about-con block-con">
            <div class="about-img">
                <img src="{{$vars['about']['img']}}"/>
            </div>
            <div class="about-desc">
                {!! $vars['about']['desc'] !!}
            </div>
        </div>
    </div>
    <div class="block-header">
        <div class="block-title">资讯动态</div>
        <div class="block-header-more">
            <a href="/article/list">
                更多
                <span class="block-more-icon">
                  <img src="/themes/simple-h5/static/imgs/arrow-r.png" >
                </span>
            </a>
        </div>
    </div>
    <div class="news-con block-con">
        <ul>
            @foreach ((new \app\common\services\content\ArticleService())->getLastList(3,0,0,0) as $item)
            <li>
                <a href="/article/detail?id={{$item['id']}}">{{$item['title']}}</a>
            </li>
            @endforeach
        </ul>
    </div>

    <script>
        $(function(){
            var mySwiper = new Swiper ('.swiper-container', {
                loop:true,
                autoplay:3000
                //其他设置
            });
        })
    </script>
@endsection